.guangbiao {
  @include square(100%);
  position: relative;
  > .g-1 {
    @include square(100%);
    background-image: url("../image/blink-1.png");
    background-size: 100% 100%;
    animation: rotate1 1s linear infinite;
    -webkit-animation: rotate1 1s linear infinite;
    position: absolute;
    top: 0;
    left: 0;
  }
  > .g-2 {
    background-image: url("../image/blink-2.png");
    background-size: 100% 100%;
    @include square(100%);
    animation: rotate1 5s linear infinite alternate;
    -webkit-animation: rotate1 5s linear infinite alternate;
    position: absolute;
    top: 0;
    left: 0;
  }
  > .g-3 {
    @include square(100%);
    background-image: url("../image/blink-3.png");
    background-size: 100% 100%;
    animation: rotate2 1s linear infinite alternate;
    -webkit-animation: rotate2 1s linear infinite alternate;
    position: absolute;
    top: 0;
    left: 0;
  }
}

@keyframes rotate1 {
  from {
    transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
  }

  to {

    transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
  }
}

@-webkit-keyframes rotate1 {
  from {
    transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
  }

  to {

    transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
  }
}

@keyframes rotate2 {
  from {
    transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
  }

  to {

    transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
  }
}

@-webkit-keyframes rotate2 {
  from {
    transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
  }

  to {

    transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
  }
}